<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script th:src="@{/js/jquery-3.2.1.min.js}"></script>
</head>
<body>
<div class="row">
    <div class="col-md-12">
        <div class="alert alert-success">
                <table border="2" align="center">
                    <tr>
                        <form th:action="@{/selectById}" method="post">
                            <td colspan="4"><input name="id" type="text"></td>
                            <td><input type="submit" value="查询"></td>
                        </form>
                    </tr>
                    <tr>
                        <td>序号</td>
                        <td>型号</td>
                        <td>年龄</td>
                        <td>操作</td>
                        <td>操作</td>
                    </tr>
                    <tr>
                        <td th:text = "${girl.id}"></td>
                        <td th:text = "${girl.cupSize}"></td>
                        <td th:text = "${girl.age}"></td>
                        <td><a th:href="@{/delete(id=${girl.id})}" >删除</a></td>
                        <td><a th:href="@{/selectOne(id=${girl.id})}" >更新</a></td>
                    </tr>
                    <tr>
                        <td colspan="5" align="center">
                            <button id="insertBtn">添加用户</button>
                        </td>
                    </tr>
                </table>
        </div>
    </div>
</div>

</div>
<div id="fom" class="row" style="display: none">
    <div class="col-md-12">
        <div class="alert alert-success">
            <form th:action="@{/insertGirl}" method="post">
                <table border="2" align="center">
                    <tr>
                        <td>序号</td>
                        <td><input name="id" type="text" /></td>
                    </tr>
                    <tr>
                        <td>型号</td>
                        <td><input name="cupSize" type="text" /></td>
                    </tr>
                    <tr>
                        <td>年龄</td>
                        <td><input name="age" type="text" /></td>
                    </tr>
                    <tr>
                        <td colspan="2" align="center">
                            <input type="submit" value="添加"/>
                        </td>
                    </tr>
                </table>
            </form>
        </div>
    </div>
</div>
</body>
<script type="text/javascript" >
    $(function () {
        $("#insertBtn").click(function () {
            if($("#fom").css("display")=="none"){
                $("#fom").attr("style","display:block;");
            }else{
                $("#fom").attr("style","display:none;");
            }
        });
    })
</script>
</html>